#gx-horizontal-item{
  width:100%;
  height:100%;
  padding-left: 18px;
  padding-right: 18px;
}

#cover-img {
  width:84px;
  height:112px;
  border-radius: 7px;
  background-size:cover;
  background-color:#9e9e9e;
}

.text-area {
  padding-left: 9px;
  padding-right: 0px;
  padding-bottom: 0px;
  flex-grow: 1;
  flex-direction:column;
}

.title-area {
  width:100%;
  height:20px;
}

.title {
  flex-grow:1;
  height:20px;
  line-height:20px;
  font-size:14px;
  color: #222222;
  fit-content: true;
}

.year {
  margin-left:6px;
  height:20px;
  line-height:20px;
  width:40px;
  font-size:11px;
  color: #999999;
}

.top-text {
  margin-top:3px;
  width:100%;
  height:16px;
  font-size:11px;
  color: #999999;
}

.bottom-text {
  margin-top: 3px;
  width:100%;
  height:16px;
  min-height:16px;
  font-size:11px;
  text-overflow: ellipsis;
  color: #999999;
  lines: 2;
  fit-content: true;
}

.reason-view {
  border-radius:7px;
  height:28px;
  left:9px;
  right:0px;
  bottom:0px;
  position:absolute;
  background-color: #f5f5f5;
}

.reason-icon {
  left:4px;
  top:0px;
  width:18px;
  height:18px;
  position:absolute;
}

.reason {
  margin-left:6px;
  margin-right:6px;
  flex-grow:1;
  height:28px;
  line-height:28px;
  font-size:11px;
  color:#999999;
}
